import { ref, isRef, unref, watchEffect } from 'vue'
export function useFetch(url: any) {
  const data = ref(null)
  const error = ref(null)

  function doFetch() {
    //在请求之前设置状态...
    data.value = null
    error.value = null
    //unref() 解包可能为 ref的值
    fetch(unref(url))
      .then((res) => res.json())
      .then((json) => (data.value = json))
      .catch((err) => (error.value = err))
  }

  if (isRef(url)) {
    //若输入的URL是一个ref，那么启动一个响应式的请求
    watchEffect(doFetch)
  } else {
    //否则只请求一次
    //避免监听器的额外开销
    doFetch()
  }

  return { data, error }
}